// 2. 路由配置文件
import { createRouter, createWebHashHistory } from "vue-router";
// import { useStore } from "vuex";  // inject() can only be used inside setup() or functional components.
// const store = useStore();
import store from "../store";
// console.log(store);
// let isLogin = false; //模拟登录状态

// 把当前用户角色有权访问的路由path，整理到一个数组中（路由白名单），方便判断
let whiteList = ["/", "/nopermission"];
let info = localStorage.getItem("vue-admin-userinfo");
// 递归方法
const getWhiteList = (arr) => {
  arr.forEach((item) => {
    whiteList.push(item.path);
    if (item.children) {
      getWhiteList(item.children);
    }
  });
};
if (info) {
  let { roleMenu } = JSON.parse(info);
  getWhiteList(roleMenu);
}
console.log("路由白名单", whiteList);

export const routes = [
  {
    path: "/",
    component: () => import("../layout/index.vue"),
    children: [
      {
        path: "/banner",
        component: () => import("../views/banner/index.vue"),
        meta: {
          label: "轮播管理",
          icon: "PictureFilled",
        },
        children: [
          {
            path: "/banner/list",
            component: () => import("../views/banner/list.vue"),
            meta: {
              label: "轮播列表",
            },
          },
          {
            path: "/banner/pub",
            component: () => import("../views/banner/pub.vue"),
            meta: {
              label: "轮播发布",
            },
          },
          {
            path: "/banner/edit",
            component: () => import("../views/banner/edit.vue"),
            meta: {
              label: "轮播编辑",
            },
          },
        ],
      },
      {
        path: "/product",
        component: () => import("../views/goods/index.vue"),
        meta: {
          label: "产品管理",
          icon: "Present",
        },
        children: [
          {
            path: "/product/pub",
            component: () => import("../views/goods/pub.vue"),
            meta: {
              label: "商品转存",
            },
          },
          {
            path: "/product/list",
            component: () => import("../views/goods/list.vue"),
            meta: {
              label: "商品列表(前端筛选)",
            },
          },
          {
            path: "/product/list/back/end",
            component: () => import("../views/goods/list-back-end.vue"),
            meta: {
              label: "商品列表(后端筛选)",
            },
          },
        ],
      },
      {
        path: "/manager",
        component: () => import("../views/manager/index.vue"),
        meta: {
          label: "系统设置",
          icon: "Setting",
        },
        children: [
          {
            path: "/manager/role1",
            component: () => import("../views/manager/role1.vue"),
            meta: {
              label: "角色管理(简易)",
            },
          },
          {
            path: "/manager/role",
            component: () => import("../views/manager/role.vue"),
            meta: {
              label: "角色管理(完整)",
            },
          },
          {
            path: "/manager/user",
            component: () => import("../views/manager/user.vue"),
            meta: {
              label: "用户管理",
            },
          },
        ],
      },
      {
        path: "/rich/text",
        component: () => import("../views/rich-editor.vue"),
        meta: {
          label: "富文本编辑器",
          icon: "GoodsFilled",
        },
      },
      {
        path: "/map",
        component: () => import("../views/map.vue"),
        meta: {
          label: "百度地图",
          icon: "GoodsFilled",
        },
      },
      {
        path: "/echarts",
        component: () => import("../views/echarts/index.vue"),
        meta: {
          label: "数据可视化",
          icon: "GoodsFilled",
        },
      },
      {
        path: "/excel",
        component: () => import("../views/excel/index.vue"),
        meta: {
          label: "excel表格",
          icon: "Setting",
        },
        children: [
          {
            path: "/excel/export",
            component: () => import("../views/excel/export.vue"),
            meta: {
              label: "导出excel",
            },
          },
          {
            path: "/excel/inport",
            component: () => import("../views/excel/inport.vue"),
            meta: {
              label: "导入excel",
            },
          },
        ],
      },
      {
        path: "/vuex/test",
        component: () => import("../views/vuex-test/index.vue"),
        meta: {
          label: "状态机使用",
          icon: "GoodsFilled",
        },
      },
      {
        path: "/nopermission",
        component: () => import("../views/nopermission.vue"),
        meta: {
          label: "无权访问",
          icon: "GoodsFilled",
        },
      },
    ],
  },
  {
    path: "/login",
    component: () => import("../views/login.vue"),
  },
];

//创建路由对象
const router = createRouter({
  history: createWebHashHistory(), //路由模式
  routes,
});

//全局前置守卫
router.beforeEach((to, from, next) => {
  if (to.path.indexOf("/login") == -1) {
    if (store.state.user.userInfo) {
      console.log(whiteList, to.path);
      if (whiteList.includes(to.path)) {
        next();
      } else {
        next("/nopermission");
      }
    } else {
      next("/login");
    }
  } else {
    next(); //访问登录面板直接放行
  }
});

export default router;
